<template>
  <div class="options" v-show="props.params.data.status == 1">
    <el-dialog v-model="showContent" width="65%" :show-close="false" top="1vh" :append-to-body="true"
      style="border-radius: 16px;font-size:30px;">
      <div class="content" :style="{ 'max-height': dialogContentHeight }">
        {{ params.data.content }}
      </div>
      <div class="btns">
        <div class="btn reject" @click="reject($event)">Reject</div>
        <div class="btn accept" @click="accept($event)">Accept</div>
      </div>
    </el-dialog>
    <div class="btn reject" @click="reject($event)">Reject</div>
    <div class="btn accept" @click="accept($event)">Accept</div>
    <div class="btn detail" @click="showDetail($event)">Detail</div>
  </div>
</template>
<script lang="ts" setup>
import { ref } from 'vue'
import { GetCertification } from '@/vendors/certification/certification'
import useSetting from '@/vendors/store/setting'
const props = defineProps({
  params: {
    type: Object as () => any, // 修改/删除操作携带的参数 如table_id
    required: true
  },
  updateFunc: {
    type: Function, // 修改/删除操作携带的参数 如table_id
    default: () => { }
  }
})
const {
  updateAudit
} = GetCertification()
const setting = useSetting()
const accept = (event: any) => {
  updateAudit(props.params.data.id, 2, props.params.data.user_id, () => {
    props.updateFunc()
    // setting.setTextCount(setting.count[3].num - 1)
  })
}
const reject = (event: any) => {
  updateAudit(props.params.data.id, 3, props.params.data.user_id , () => {
    props.updateFunc()
    // setting.setTextCount(setting.count[3].num - 1)
  })
}
const showContent = ref(false)
const showDetail = (v: any) => {
  showContent.value = true
}
const dialogContentHeight = window.innerHeight - 230 + 'px'
</script>
<style scoped lang="scss">
.options {
  display: flex;
  justify-content: center;

  .detail {
    color: white;
    background: #04BF20;
  }
}

.content {
  font-size: 25px;
  overflow-y: scroll;
}

.btn {
  width: 136px;
  line-height: 48px;
  border-radius: 12px;
  font-family: Montserrat;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0em;
  text-align: center;
  cursor: pointer;
}

.reject {
  margin-right: 16px;
  border: 1px solid rgba(0, 0, 0, 0.2);
  color: rgba(250, 74, 130, 1);
}

.accept {
  color: white;
  background: rgba(0, 132, 255, 1);
  margin-right: 16px;
}

.btns {
  width: 300px;
  display: flex;
  margin: 10px auto;
}</style>
